<template>
  <div class="googmv">
       <!-- <video :src="mvn" controls class="idmo"></video> -->
	   <video preload='auto' id='my-video'  :src="isos"  
	   webkit-playsinline='true' 
	   controls
		playsinline='true' 
		x-webkit-airplay='true' x5-video-player-type='h5' 
		x5-video-player-fullscreen='true' x5-video-ignore-metadata='true'  >
		<p> 不支持video</p> 
	 </video>
  </div>
  
</template>

<script>
export default {
  name: 'mv',
  data () {
    return {
		id:"",
		isos:""
    }
  },
  created() {
    if(this.$route.path.includes('ismv')&&this.$route.params.id){ //只有排行榜页面才执行
    	this.id=this.$route.params.id
		console.log()
    }
  },
  computed: {
	 // mvn(){return `https://api.bzqll.com/music/tencent/mvUrl?key=579621905&id=${this.id}&r=4`}
  },
  watch: {
  	id(newValue) {
  		this.isos=`https://api.bzqll.com/music/tencent/mvUrl?key=579621905&id=${newValue}&r=4`
      }
  	}

  
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="less"  scoped>

#my-video{
	width:100%;
	height:300px;
    object-fit:contain;
    object-position: center center;
} 
   
</style>
